<template>
    <div class="mainDiv" style="padding: 10px;box-sizing: border-box;">
        <el-collapse style="height: 100%; overflow-y: auto; overflow-x: hidden;" :value="atv">
            <el-collapse-item :name="r.id" v-for="r in rule" :key="r.id">
                <el-checkbox slot="title" @change="checkAll(r)" v-model="r.checked">{{r.name}}</el-checkbox>
                <el-checkbox v-for="c in r.child" v-model="c.checked" @change="checkBufen(r)" :key="c.name">{{c.name}}</el-checkbox>
            </el-collapse-item>
        </el-collapse>
        <div style="text-align: right;">
            <el-button type="danger" icon="el-icon-close" @click="closeWin">取消关闭</el-button>
            <el-button type="success" icon="el-icon-upload" @click="submit">确定选择</el-button>
        </div>
    </div>
</template>
<script>
import C from '#/src/common/common.js'
export default {
    name: 'editGrade',
    data() {
        return {
            rule: [],
            permission: [],
            atv: [],
            id: ''
        }
    },
    mounted() {
        if (C.getDatas()) {
            this.id = C.getDatas().id
        }
        this.getlimit()
    },
    methods: {
        getlimit: async function() {
            var that = this
            let data = await C.ajax('/organization/rule/getrule', { id: this.id })
            console.log(data)
            if (data) {
                let perm = data.perm.length ? JSON.parse(data.perm) : []
                let rList = []
                data.rule.forEach((v) => {
                    if (v.category === 3) {
                        v.checked = true
                        v.child = []
                        rList.push(v)
                        that.atv.push(v.id)
                    }
                })
                data.rule.forEach((v) => {
                    if (v.category === 4) {
                        rList.forEach((r) => {
                            if (v.pid == r.id) {
                                if (perm.indexOf(v.tags) != -1) v.checked = true
                                else v.checked = false
                                r.child.push(v)
                                if (!v.checked) r.checked = false
                            }
                        })
                    }
                })
                that.rule = rList
                that.permission = perm
            }
        },
        checkAll: function(o) {
            if (o.checked) {
                o.child.forEach((v) => {
                    v.checked = true
                })
            } else {
                o.child.forEach((v) => {
                    v.checked = false
                })
            }
        },
        checkBufen: function(o) {
            o.child.forEach((v) => {
                if (!v.checked) o.checked = false
            })
        },
        submit: async function() {
            let permis = []
            this.rule.forEach((v) => {
                v.child.forEach((c) => {
                    if (c.checked) {
                        permis.push(c.tags)
                    }
                })
            })

            let rtData = {
                pers: JSON.stringify(permis),
                id: this.id
            }

            let data = await C.ajax('/organization/rule/editadminpermissions', rtData, 'post')
            if (data) {
                C.closeBrowserWindow(data)
            }
        },
        closeWin: function() {
            C.closewin()
        }
    }
}
</script>